<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<!-- FlexPaperViewer flash version debug template --> 
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">	
    <head> 
        <title>FlexPaper</title>                
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
        <style type="text/css" media="screen"> 
			html, body	{ height:100%; }
			body { margin:0; padding:0; overflow:auto; }   
			#flashContent { display:none; }
        </style> 
		
		<script type="text/javascript" src="../js/flexpaper_flash_debug.js"></script>
		<script type="text/javascript" src="../js/jquery.js"></script>
		
    </head> 
    <body> 
    	<div style="position:absolute;left:10px;top:10px;">
	        <a id="viewerPlaceHolder" style="width:680px;height:480px;display:block"></a>
	        
	        <script type="text/javascript"> 
				var fp = new FlexPaperViewer(	
						 '../FlexPaperViewer',
						 'viewerPlaceHolder', { config : {
						 SwfFile : '../Paper.swf',
						 Scale : 0.6, 
						 ZoomTransition : 'easeOut',
						 ZoomTime : 0.5,
						 ZoomInterval : 0.2,
						 FitPageOnLoad : false,
						 FitWidthOnLoad : false,
						 FullScreenAsMaxWindow : false,
						 ProgressiveLoading : false,
						 MinZoomSize : 0.2,
						 MaxZoomSize : 5,
						 SearchMatchAll : false,
						 InitViewMode : 'Portrait',
						 
						 ViewModeToolsVisible : true,
						 ZoomToolsVisible : true,
						 NavToolsVisible : true,
						 CursorToolsVisible : true,
						 SearchToolsVisible : true,
  						
  						 localeChain: 'en_US'
						 }});
	        </script>  
        </div>
        <div style="position:absolute;left:700px;top:10px;font-family:Verdana;font-size:9pt;background-color:#CACACA;">
        <div style="font-size:15px;font-weight:bold;text-align:center;margin-top:10px;margin-bottom:10px;">FlexPaper Interactive API</div>
		<div style="padding: 5px 5px 5px 5px;background-color:#EFEFEF">
        <table border="0" width="360">
	        <tr><th colspan=3>Operations</th></tr>
	        <tr><td>loadSwf</td><td><input type=text style="width:150px;" id="txt_swffile" value="../Paper.swf"></td><td><input type=submit value="Invoke" onclick="$FlexPaper().loadSwf($('#txt_swffile').val())"></td></tr>
	        <tr><td>fitWidth</td><td></td><td><input type=submit value="Invoke" onclick="$FlexPaper().fitWidth()"></td></tr>
	        <tr><td>fitHeight</td><td></td><td><input type=submit value="Invoke" onclick="$FlexPaper().fitHeight()"></td></tr>
	        <tr><td>gotoPage</td><td><input type=text style="width:150px;" id="txt_pagenum" value="3"></td><td><input type=submit value="Invoke" onclick="$FlexPaper().gotoPage($('#txt_pagenum').val())"></td></tr>
	        <tr><td>getCurrPage</td><td></td><td><input type=submit value="Invoke" onclick="alert('Current page:' + $FlexPaper().getCurrPage())"></td></tr>
	        <tr><td>getTotalPages</td><td></td><td><input type=submit value="Invoke" onclick="alert('Total pages:' + $FlexPaper().getTotalPages())"></td></tr>
	        <tr><td>nextPage</td><td></td><td><input type=submit value="Invoke" onclick="$FlexPaper().nextPage()"></td></tr>
	        <tr><td>prevPage</td><td></td><td><input type=submit value="Invoke" onclick="$FlexPaper().prevPage()"></td></tr>
	        <tr><td>setZoom</td><td><input type=text style="width:150px;" id="txt_zoomfactor" value="1.30"></td><td><input type=submit value="Invoke" onclick="$FlexPaper().setZoom($('#txt_zoomfactor').val())"></td></tr>
	        <tr><td>searchText</td><td><input type=text style="width:150px;" id="txt_searchtext" value="text"></td><td><input type=submit value="Invoke" onclick="$FlexPaper().searchText($('#txt_searchtext').val())"></td></tr>
	        <tr><td>switchMode</td><td><input type=text style="width:150px;" id="txt_viewmode" value="Tile"></td><td><input type=submit value="Invoke" onclick="$FlexPaper().switchMode($('#txt_viewmode').val())"></td></tr>
	        <tr><td>printPaper</td><td></td><td><input type=submit value="Invoke" onclick="$FlexPaper().printPaper()"></td></tr>
	        <tr><td>highlight</td><td><input type=text style="width:150px;" id="txt_highlighturl" value="highlight.xml"></td><td><input type=submit value="Invoke" onclick="$FlexPaper().highlight($('#txt_highlighturl').val())"></td></tr>
	        <tr><td>postSnapshot</td><td><input type=text style="width:150px;" id="txt_postsnapshot" value=""></td><td><input type=submit value="Invoke" onclick="$FlexPaper().postSnapshot($('#txt_postsnapshot').val())"></td></tr>
        </table>
        <br/><br/>
        <table border="0" width="230">
        	<tr><th>Event Log</th></tr>
        	<tr><td><textarea rows=6 cols=28 id="txt_eventlog" style="width:350px;font-size:9px;" wrap="off"></textarea></td></tr>
        	<tr><td><input type=text style="width:350px;" id="txt_progress" value=""></td></tr>
	    </table>
        </div>
	</div>
   </body> 
</html> 